<template>
	<view class="user-wallet">
		<view class="contain bg-white m-b-20">
			<!-- 资产总计 -->
			<view class="header">
				<view class="white m-b-20">
					<view class="xs">总积分</view>
					<view style="font-size: 76rpx">{{
            wallet.user_integral || "0.00"
          }}</view>
				</view>
				<view class="money white flex">
					<template v-if="wallet.open_racharge">
						<router-link style="height: 58rpx" class="flex primary bg-white br60 btn" size="xs"
							to="/bundle/pages/user_integral_payment/user_integral_payment">充值</router-link>
					</template>
				</view>
			</view>

			<!-- 资金明细 -->
			<view class="nav flex">
				<router-link class="nav-item" to="/bundle/pages/integral_transfer/integral_transfer">
					<view class="flex-col col-center">
						<image class="icon" src="../../static/icon_yezz.png"></image>
						<view class="m-t-10 sm">积分转账</view>
					</view>
				</router-link>
				<router-link class="nav-item" to="/bundle/pages/integral_details/integral_details">
					<view class="flex-col col-center">
						<image class="icon" src="../../static/icon_zhmx.png"></image>
						<view class="m-t-10 sm">账户明细</view>
					</view>
				</router-link>
				<router-link class="nav-item" to="/bundle/pages/transfer_record/transfer_record">
					<view class="flex-col col-center">
						<image class="icon" src="../../static/icon_zzjl.png"></image>
						<view class="m-t-10 sm">转账记录</view>
					</view>
				</router-link>
				<!-- <router-link class="nav-item" to="/bundle/pages/recharge_integral_record/recharge_integral_record">
					<view class="flex-col col-center">
						<image class="icon" src="../../static/icon_czjl.png"></image>
						<view class="m-t-10 sm">充值记录</view>
					</view>
				</router-link> -->
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getWalletTow
	} from "@/api/user";
	export default {
		data() {
			return {
				wallet: {},
			};
		},

		onShow() {
			this.getWalletFun();
		},

		methods: {
			getWalletFun() {
				getWalletTow().then((res) => {
					if (res.code == 1) {
						this.wallet = res.data;
					}
				});
			},
		},
	};
</script>
<style lang="scss">
	.user-wallet {
		.contain {
			padding: 20rpx 30rpx 36rpx;

			.header {
				position: relative;
				background: linear-gradient(180deg,
						rgba(255, 44, 60, 1) 0%,
						rgba(255, 49, 106, 1) 100%);
				border-radius: 20rpx;
				padding: 50rpx 30rpx 30rpx;
				box-sizing: border-box;

				.money {
					.item {
						flex: 1;
					}
				}

				.btn {
					position: absolute;
					right: 30rpx;
					top: 50rpx;
					padding: 0 51rpx;
				}
			}

			.nav {
				border-bottom: $-solid-border;

				.nav-item {
					width: 25%;
					padding: 40rpx 0;

					.icon {
						width: 52rpx;
						height: 52rpx;
					}
				}
			}
		}
	}

	.activity {
		padding: 40rpx 0rpx;

		.activity-title {
			font-weight: bold;
		}

		.activity-item {
			padding: 15rpx 40rpx;
			// box-shadow: 0px 0rpx 20rpx rgba(0, 0, 0, 0.16);
			margin-top: 34rpx;

			.join-btn {
				height: 52rpx;
				width: 156rpx;
				margin-top: 24rpx;
			}
		}
	}
</style>